import React from 'react';
import { Icon } from 'antd';
import styles from './index.less';
const UserIcon = () => (
  <svg xmlns="http://www.w3.org/2000/svg" width="19.067" height="22" viewBox="0 0 19.067 22">
  
  <path fill="#debc66"  d="M137.533,43.733a5.867,5.867,0,1,0-5.867-5.867A5.884,5.884,0,0,0,137.533,43.733Zm0-10.267a4.4,4.4,0,1,1-4.4,4.4A4.413,4.413,0,0,1,137.533,33.467Zm2.2,11h-4.4c-4.253,0-7.333,2.787-7.333,6.6V51.8c0,1.98,2.2,2.2,7.333,2.2h4.4c4.987,0,7.333-.22,7.333-2.2v-.733C147.067,47.253,143.987,44.467,139.733,44.467ZM145.6,51.8c0,.733-4.253.733-5.867.733h-4.4c-1.76,0-5.867,0-5.867-.733v-.733c0-3.007,2.42-5.133,5.867-5.133h4.4c3.447,0,5.867,2.127,5.867,5.133Z" transform="translate(-128 -32)"/>
</svg>
);
const picon = () => (
  <svg xmlns="http://www.w3.org/2000/svg" width="18.701" height="22" viewBox="0 0 18.701 22">
  
  <path fill="#debc66"  d="M101.109,24.847a1.65,1.65,0,0,1,1.65,1.65v7.7a1.65,1.65,0,0,1-1.65,1.65h-12.1a1.65,1.65,0,0,1-1.65-1.65V26.5a1.65,1.65,0,0,1,1.65-1.65h12.1m0-1.65h-12.1a3.3,3.3,0,0,0-3.3,3.3v7.7a3.3,3.3,0,0,0,3.3,3.3h12.1a3.3,3.3,0,0,0,3.3-3.3V26.5A3.3,3.3,0,0,0,101.109,23.2Zm-6.05-6.05A3.849,3.849,0,0,1,98.909,21v2.2h-7.7V21a3.849,3.849,0,0,1,3.849-3.849m0-1.65a5.5,5.5,0,0,0-5.5,5.5v3.85h11V21a5.5,5.5,0,0,0-5.5-5.5Zm0,17.325A.824.824,0,0,1,94.236,32V28.7a.824.824,0,0,1,1.649,0V32a.824.824,0,0,1-.824.824Z" transform="translate(-85.709 -15.497)"/>
</svg>
);
const UserIconView = props => <Icon component={UserIcon} {...props} />;
const Piconv = props => <Icon component={picon} {...props} />;
export default {
  UserName: {
    props: {
      size: 'large',
      id: 'userName',
      prefix: <UserIconView className={styles.prefixIcon}/> ,
      placeholder: 'admin',
      bordered:"false"
    },
    rules: [
      {
        required: true,
        message: <span />,
        whitespace: true,
      },
    ],
  },
  Password: {
    props: {
      size: 'large',
      prefix: <Piconv className={styles.prefixIcon} />,
      type: 'password',
      id: 'password',
      placeholder: '888888',
      bordered:"false"
    },
    rules: [
      {
        required: true,
        message: <span />,
      },
    ],
  },
  Mobile: {
    props: {
      size: 'large',
      prefix: <Icon type="mobile" className={styles.prefixIcon} />,
      placeholder: 'mobile number',
    },
    rules: [
      {
        required: true,
        message: 'Please enter mobile number!',
      },
      {
        pattern: /^1\d{10}$/,
        message: 'Wrong mobile number format!',
      },
    ],
  },
  Captcha: {
    props: {
      size: 'large',
      prefix: <Icon type="mail" className={styles.prefixIcon} />,
      placeholder: 'captcha',
    },
    rules: [
      {
        required: true,
        message: 'Please enter Captcha!',
      },
    ],
  },
};
